<!DOCTYPE html>
<html lang="en" xmlns:th="http://thymeleaf.org">
<head  th:fragment="common_header(title)">
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title th:replace="${title}">Shiqi - Responsive Bootstrap 4 Admin Dashboard Template</title>
    <!-- Favicon -->
    <link rel="shortcut icon" th:href="@{/images/favicon.ico}"/>
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
    <!-- Typography CSS -->
    <link rel="stylesheet" th:href="@{/css/typography.css}">
    <!-- Style CSS -->
    <link rel="stylesheet" th:href="@{/css/style.css}">
    <!-- Responsive CSS -->
    <link rel="stylesheet" th:href="@{/css/responsive.css}">
    <!-- Full calendar -->
    <link th:href='@{/fullcalendar/core/main.css}' rel='stylesheet'/>
    <link th:href='@{/fullcalendar/daygrid/main.css}' rel='stylesheet'/>
    <link th:href='@{/fullcalendar/timegrid/main.css}' rel='stylesheet'/>
    <link th:href='@{/fullcalendar/list/main.css}' rel='stylesheet'/>

    <link rel="stylesheet" th:href="@{/css/flatpickr.min.css}">

</head>
<body>

<div th:fragment="common_js(scripts)">
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/popper.min.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <!-- Appear JavaScript -->
    <script th:src="@{/js/jquery.appear.js}"></script>
    <!-- Countdown JavaScript -->
    <script th:src="@{/js/countdown.min.js}"></script>
    <!-- Counterup JavaScript -->
    <script th:src="@{/js/waypoints.min.js}"></script>
    <script th:src="@{/js/jquery.counterup.min.js}"></script>
    <!-- Wow JavaScript -->
    <script th:src="@{/js/wow.min.js}"></script>
    <!-- Apexcharts JavaScript -->
    <script th:src="@{/js/apexcharts.js}"></script>
    <!-- Slick JavaScript -->
    <script th:src="@{/js/slick.min.js}"></script>
    <!-- Select2 JavaScript -->
    <script th:src="@{/js/select2.min.js}"></script>
    <!-- Owl Carousel JavaScript -->
    <script th:src="@{/js/owl.carousel.min.js}"></script>
    <!-- Magnific Popup JavaScript -->
    <script th:src="@{/js/jquery.magnific-popup.min.js}"></script>
    <!-- Smooth Scrollbar JavaScript -->
    <script th:src="@{/js/smooth-scrollbar.js}"></script>
    <!-- lottie JavaScript -->
    <script th:src="@{/js/lottie.js}"></script>
    <!-- am core JavaScript -->
    <script th:src="@{/js/core.js}"></script>
    <!-- am charts JavaScript -->
    <script th:src="@{/js/charts.js}"></script>
    <!-- am animated JavaScript -->
    <script th:src="@{/js/animated.js}"></script>
    <!-- am kelly JavaScript -->
    <script th:src="@{/js/kelly.js}"></script>
    <!-- Flatpicker Js -->
    <script th:src="@{/js/flatpickr.js}"></script>
    <!-- Chart Custom JavaScript -->
    <script th:src="@{/js/chart-custom.js}"></script>
    <!-- Custom JavaScript -->
    <script th:src="@{/js/custom.js}"></script>
</div>

</body>
</html>
